<template lang="html">
  <div class="main-page" id="store-page">
    <div class="main-content has-header-space new_register">
      <div class="new_register_top">
        <div class="new_register_coupon_list">
          <ul>
            <template v-for="(item, index) in couponListData">
              <li :key="index">
                <h3><span>¥</span>{{item.voucher_price}}</h3>
                <p>{{item.voucher_subtotal}}</p>
              </li>
            </template>
          </ul>
        </div>
        <div class="new_register_gift">
          <h3>新人专享礼包</h3>
          <h3><span>¥</span>{{all_coupon_amount}}</h3>
          <p class="receive" @click="getReceive">一键领取</p>
        </div>
      </div>
      <div class="new_register_coupon_time">
        <p>领取成功后，可在“<span>我的-优惠券</span>”页面查看</p>
        <p>2019.09.24起新注册用户均可参加</p>
      </div>
      <div class="new_register_content">
        <p class="title">新人用券爆款推荐</p>
        <div class="new_register_prd">
          <template v-if="couponPrdData.length !== 0">
            <van-list v-model="loading" error-text="请求失败，点击重新加载" @load="onLoad()" loading-text="正在加载中" :finished="finished">
              <template v-for="(item, index) in couponPrdData">
                <div class="new_register_prd_card" :key="index" @click="continueBuy(item)">
                  <div class="new_register_prd_img">
                    <img :src="item.product_image" alt="">
                    <p>用券减{{item.coupon_amount}}元</p>
                  </div>
                  <div class="new_register_prd_content">
                    <p class="product_name">{{item.product_short_name}}</p>
                    <p class="product_details">{{item.product_tips}}</p>
                    <div class="product_lable">
                      <p :key="index" v-for="(item, index) in item.activity_tab_names">{{item}}</p>
                    </div>
                    <div class="product_right">
                      <img src="../../assets/image/activity/new_register/vip_icon.png" alt="">
                      <p>加入会员,预计可返利{{item.discount}}元</p>
                    </div>
                    <div class="product_price">
                      <p>¥{{item.product_unit_price}}</p>
                      <p>¥{{item.product_market_price}}</p>
                    </div>
                  </div>
                </div>
              </template>
              <div class="new_register_prd_card new_register_prd_card_empty" v-if="couponPrdData.length%2 !== 0"></div>
            </van-list>
          </template>
          <template v-else>
            <div class="empty_product">
              <img src="../../assets/image/activity/feedback/empty_product.png" alt="">
            </div>
          </template>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
// import Path from '@/utils/path.js'
import Tool from '@/utils/tool.js'
// import Domain from '@/utils/domain.js'

export default {
  data () {
    return {
      user_info: {},
      couponListData: [],
      couponPrdData: [],
      all_coupon_amount: 0,
      isClient: false,
      coupon_id: '',
      page: 0,
      finished: false,
      loading: true
    }
  },
  created () {
    // this.getProfile()
    this.getCouponList()
    let isClient = Tool.isClient()
    this.isClient = isClient
  },
  methods: {
    getProfile () {
      return new Promise((resolve, reject) => {
        this.$Axios({ url: 'profile', method: 'get' }).then((resp) => { // 请求成功
          if (resp.return_code === '0000') {
            this.user_info = resp.data.user_info
          }
          resolve(resp)
        }).catch((error) => { // 请求失败
          this.$_requestInterceptor('error', error)
          reject(error)
        })
      })
    },
    getCouponList () {
      return new Promise((resolve, reject) => {
        this.$Axios({ url: 'coupon_template?promotion_way_code=REGISTER_COUPON&pagesize=4', method: 'get' }).then((resp) => { // 请求成功
          if (resp.return_code === '0000') {
            this.couponListData = resp.data.list
            /* eslint-disable */
            let coupon_id = []
            resp.data.list.forEach(item => {
              this.all_coupon_amount += item.coupon_amount
              coupon_id.push(item.id)
            })
            coupon_id = coupon_id.join()
            this.coupon_id = coupon_id
            this.getCouponPrdData(coupon_id)
          }
          resolve(resp)
        }).catch((error) => { // 请求失败
          this.$_requestInterceptor('error', error)
          reject(error)
        })
      })
    },
    getCouponPrdData (data) {
      console.log(data)
      let params = {
        ids: data,
        page: this.page
      }
      return new Promise((resolve, reject) => {
        this.$Axios({ url: 'activity_new_user', params: params, method: 'get' }).then((resp) => { // 请求成功
          if (resp.return_code === '0000') {
            this.couponPrdData = this.couponPrdData.concat(resp.data.list)
            this.couponPrdData.forEach(item => {
              if (item.activity_tab_names.indexOf('新人专享') === -1) {
                item.activity_tab_names.push('新人专享')
              }
            })
            if (resp.data.list.length < 10) {
              this.finished = true
            }
          }
          this.loading = false
          resolve(resp)
        }).catch((error) => { // 请求失败
          this.$_requestInterceptor('error', error)
          reject(error)
        })
      })
    },
    onLoad () {
      this.page = this.page + 1
      this.getCouponPrdData(this.coupon_id)
    },
    getReceive () {
      let coupon_codes = []
      this.couponListData.forEach(item => {
        coupon_codes.push(item.coupon_code)
      })
      let data = {
        coupon_codes: coupon_codes
      }
      return new Promise((resolve, reject) => {
        this.$Axios({ url: 'coupon_user_voucher', data, method: 'post' }).then((resp) => { // 请求成功
          if (resp.return_code === '0000') {
            this.$toast({ message: '领取成功' })
          } else {
            this.$toast({ message: resp.return_msg })
          }
          resolve(resp)
        }).catch((error) => { // 请求失败
          this.$_requestInterceptor('error', error)
          reject(error)
        })
      })
    },
    continueBuy (item) {
      let isMini = sessionStorage.getItem('isMini')
      let params = '?pid=' + item.id + '&item_id=' + item.default_item_id
      if (isMini) {
        window.wx.miniProgram.navigateTo({ url: '/pages/shopDetails/shopDetails' + params })
      } else {
        this.$router.push('/main/shopDetails' + params)
      }
    }
  }
}
</script>
